<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:include="admin::header"></head>
<section>
    <script>

        //分页查询
        getModelListByPage = function (currentPage) {
            var pageSize = $("#pageSize").val(); //每页显示条数
            var title = $("#titlePage").val();//试题标题
            var type = $("#pageType").val();//试题类型
            var str = "/exam/exam/getALLModel?currentPage="+currentPage+"&pageSize="+ pageSize+"&title="+ title+"&type="+ type;
            window.location.href = (str);
        }
        saveIds = function(modelId,addFlag){
            if (addFlag == 1){
                alert("您已添加该试题，请勿重复添加！");
                return;
            }else {
                var str = "/exam/exam/saveIds?modelId="+modelId;
                window.location.href = (str);
            }
        }
        updateConfirm = function () {
            $.ajax({
                type: "POST",
                url: "/exam/model/update",
                data: {
                    modelId: $("#modelId").val(),
                    title: $("#title").val(),
                    answer: $("#answer").val(),
                    analysis:$("#analysis").val(),
                    difficulty: $("#difficulty").val(),
                },
                dataType: "json",
                success: function (data) {
                    if (data == null) {
                        alert("修改失败！请联系管理员...");
                    } else {
                        $.each(data, function (key, value) {
                            alert(value);
                        })
                    }
                    $("#modal-update").modal('hide');
                    window.location.href = ("/exam/exam/getALLModel?title=&type=");
                }
            });
        }

    </script>
</section>
<body class="sidebar-fixed header-fixed">
<div class="page-wrapper">
    <!--导入上边栏-->
    <nav class="navbar page-header" th:include="admin::admin-navbar"></nav>

    <div class="main-container">
        <!--导入侧边栏-->
        <div class="sidebar" th:include="admin::admin-sidebar"></div>
        <div class="content">
            <div class="container" style="margin-top:50px;text-align: center;margin-bottom: 50px">
                <div class="col-md-5">
                    <form th:action="@{/model/getALLModel}" th:method="post">
                        <div class="input-group form-inline">
                            <label style="font-size: 20px">试题&nbsp;&nbsp;&nbsp;</label>
                            <input type="text" id="titlePage" name="title" class="form-control" placeholder="输入试题标题">&nbsp;
                            <select name="type" class="form-control" id="pageType">
                                <option value="0" th:selected="${session.pageType}=='0'">全部类型</option>
                                <option value="1" th:selected="${session.pageType}=='1'">选词填空</option>
                                <option value="2" th:selected="${session.pageType}=='2'">段落匹配</option>
                                <option value="3" th:selected="${session.pageType}=='3'">仔细阅读</option>
                                <option value="4" th:selected="${session.pageType}=='4'">翻译</option>
                                <option value="5" th:selected="${session.pageType}=='5'">写作</option>
                            </select>
                            <span class="input-group-btn">
                                <button type="submit" class="btn btn-primary"><i class="fa "></i> 搜索试题</button>
                            </span>
                        </div>
                    </form>
                </div>
            </div>
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header bg-light">
                                试题信息
                            </div>

                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-hover">
                                        <thead>
                                            <tr>
                                                <th>序号</th>
                                                <th>标题</th>
                                                <th>类型</th>
                                                <th>难度</th>
                                                <th>作者</th>
                                                <th>分值</th>
                                                <th>操作</th>
                                            </tr>
                                        </thead>
                                        <tbody id="tbody" th:each="modelVo,modelVoStat:${session.list}">
                                            <tr>
                                                <td th:text="${modelVoStat.index+1}">1</td>
                                                <td class="text-nowrap" th:text="${modelVo.model.title}">Samsung Galaxy S8</td>
                                                <td th:text="${modelVo.type}">31,589</td>
                                                <td th:text="${modelVo.difficulty}">$800</td>
                                                <td th:text="${modelVo.model.author}"></td>
                                                <td th:text="${modelVo.model.grade}"></td>
                                                <td>
                                                    <!--<button id="delete-btn" class="btn btn-outline-danger" type="button" name="delete" th:onclick="'javascript:updateModel('+${modelVo.model.modelId}+');'">删除</button>-->
                                                    <a id="remove-btn" class="btn btn-outline-danger" name="remove" th:href="@{/exam/removeIds(modelId=${modelVo.model.modelId})}">删除</a>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>

                                </div>
                            </div>
                            <div class="card-footer">
                                <div style="float: right;margin-right: 140px">
                                    <a class="btn btn-success btn-lg" th:href="@{/page/addExam}" href="add_exam.html">确定</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <div class="card">
                            <div class="card-header bg-light">
                                题库列表
                            </div>

                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-hover">
                                        <thead>
                                        <tr>
                                            <th>序号</th>
                                            <th>标题</th>
                                            <th>类型</th>
                                            <th>难度</th>
                                            <th>作者</th>
                                            <th>分值</th>
                                            <th>操作</th>
                                        </tr>
                                        </thead>
                                        <tbody th:each="modelVo,modelVoStat:${session.pageInfo.list}">
                                        <tr>
                                            <td th:text="${modelVoStat.index+1}">1</td>
                                            <td class="text-nowrap" th:text="${modelVo.model.title}">Samsung Galaxy S8</td>
                                            <td th:text="${modelVo.type}">31,589</td>
                                            <td th:text="${modelVo.difficulty}">$800</td>
                                            <td th:text="${modelVo.model.author}"></td>
                                            <td th:text="${modelVo.model.grade}"></td>
                                            <td>
                                                <button id="add-btn" class="btn btn-outline-primary" type="button" name="add"  th:text="${modelVo.addFlag}==1?'已添加':'添加'"
                                                        th:onclick="'javascript:saveIds('+${modelVo.model.modelId}+','+${modelVo.addFlag}+');'">添加</button>
                                                <!--<a id="add-btn" class="btn btn-outline-primary" name="add" th:href="@{/model/saveIds(modelId=${modelVo.model.modelId})}" th:text="${modelVo.addFlag}==1?'已添加':'添加'"></a>-->
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="fixed-table-pagination" style="display: block;text-align: right" >
                    <div class="pull-left pagination-detail">
                        <span class="pagination-info">显示第 <span th:text="${session.pageInfo.startRow}"></span> 到第 <span th:text="${session.pageInfo.endRow}"></span> 条记录，总共 <span th:text="${session.pageInfo.total}"></span>条记录</span>
                        <span class="page-list">每页显示
                         <span class="page-size"  th:text="${session.pageInfo.pageSize}" id="pageSize"></span>
                            <!--<span class="btn-group dropdown" style="">-->
                            <!--<button type="button" class="btn btn-default  dropdown-toggle" data-toggle="dropdown">-->
                            <!--<span class="page-size"  th:text="${pageInfo.pageSize}" id="pageSize"></span>-->
                            <!--&lt;!&ndash;保存当前页&ndash;&gt;-->
                            <!--<input type="hidden" id="pageNum" th:value="${pageInfo.pageNum}" />-->
                            <!--<span class="caret"></span>-->
                            <!--</button>-->
                            <!--<ul class="dropdown-menu" role="menu">-->
                            <!--<li  th:class="${pageInfo.pageSize== 5 }?'active':''"><a href="javascript:void(0)" th:onclick="'javascript:getUserListByPageSize('+5+')'" >5</a></li>-->
                            <!--<li  th:class="${pageInfo.pageSize== 8 }?'active':''"><a href="javascript:void(0)" th:onclick="'javascript:getUserListByPageSize('+8+')'">8</a></li>-->
                            <!--</ul>-->
                            <!--</span>-->
                        条记录
	                </span>

                    </div>
                </div>
                <nav aria-label="Page navigation" style="font-size: 20px;text-align: center">
                    <ul class="pager" id="page">
                        <li th:class="${session.pageInfo.hasPreviousPage}?'':'previous disabled'" style="display: inline">
                            <!--<a th:href="@{/user/getAllUser(currentPage=${pageInfo.prePage})}" aria-label="Previous">-->
                            <!--<span aria-hidden="true">&laquo;</span>-->
                            <!--&lt;!&ndash;← Previous&ndash;&gt;-->
                            <!--</a>-->
                            <a href="javascript:void(0)" th:onclick="'javascript:getModelListByPage('+${session.pageInfo.prePage}+');'" aria-label="Previous">
                                <span aria-hidden="true">&laquo;</span>
                                <!--← Previous-->
                            </a>
                        </li>
                        <th:block th:each="nav:${session.pageInfo.navigatepageNums}">
                            <li th:class="${nav==session.pageInfo.pageNum}?'active':''" style="display: inline">
                                <a href="javascript:void(0)" th:onclick="'javascript:getModelListByPage('+${nav}+');'" th:text="${nav}"></a>
                            </li>
                        </th:block>
                        <li th:class="${session.pageInfo.hasNextPage}?'':'next disabled'" style="display: inline">
                            <!--<a th:href="@{/user/getAllUser(currentPage=${pageInfo.nextPage},condition=null,info=null)}" aria-label="Next">-->
                            <!--&lt;!&ndash;Next →&ndash;&gt;-->
                            <!--<span aria-hidden="true">&raquo;</span>-->
                            <!--</a>-->
                            <a href="javascript:void(0)" th:onclick="'javascript:getModelListByPage('+${session.pageInfo.nextPage}+');'" aria-label="Next">
                                <!--Next →-->
                                <span aria-hidden="true">&raquo;</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="modal-update" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
     aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header bg-primary border-0">
                <h5 class="modal-title text-white">试题修改</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <!--输入框-->
            <div class="card-body">
                <div class="row">
                    <div class="col-md-8">
                        <div class="form-group">
                            <label for="modelId" class="form-control-label">序号</label>
                            <input id="modelId" class="form-control" value="" readonly/>
                        </div>
                        <div class="form-group">
                            <label for="title" class="form-control-label">标题</label>
                            <input id="title" class="form-control" value=""/>
                        </div>
                        <div class="form-group">
                            <label for="type">类型</label>
                            <select name="type" id="type" class="form-control" required>
                                <option value="1">选词填空</option>
                                <option value="2">段落匹配</option>
                                <option value="3">仔细阅读</option>
                                <option value="4">翻译</option>
                                <option value="5">写作</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="answer" class="form-control-label">答案</label>
                            <textarea id="answer" class="form-control" value="" rows="10"></textarea>
                        </div>
                        <div class="form-group">
                            <label for="analysis" class="form-control-label">解析</label>
                            <textarea id="analysis" class="form-control" value="" rows="10"></textarea>
                        </div>
                        <div class="form-group">
                            <label for="difficulty">难度</label>
                            <select id="difficulty" class="form-control">
                                <option value="0">简单</option>
                                <option value="1">一般</option>
                                <option value="2">困难</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="grade" class="form-control-label">分值</label>
                            <input id="grade" class="form-control" value="" readonly>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer border-0">
                <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
                <button type="button" class="btn btn-primary" th:onclick="'javascript:updateConfirm()'">Continue
                </button>
            </div>
        </div>
    </div>
</div>
</body>
</html>
